﻿@mixin setArrow($direction, $arrowsize, $borderColor, $borderWidth) {
    display: inline-block;
    height: $arrowsize;
    width: $arrowsize;
    border-width: $borderWidth $borderWidth 0 0;
    border-color: $borderColor;
    border-style: solid;
    @if $direction == top {
        transform: matrix(0.71,-0.71,0.71,0.71,0,0); // rotate(-45deg)
    } @else if $direction == right {
        transform: matrix(0.71,0.71,-0.71,0.71,0,0); // rotate(45deg);

        position: relative;
        top: -2px;
    } @else if $direction == down {
        transform: matrix(-0.71,0.71,-0.71,-0.71,0,0); // rotate(135deg);

        position: relative;
        top: -3px;
    } @else if $direction == left {
        transform: matrix(-0.71,-0.71,0.71,-0.71,0,0); // rotate(-135deg);

        position: relative;
        top: -2px;
    }
}
